import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';
import 'package:spree/utils/utils.dart';

import '../../provider/model/user_model.dart';
import '../../utils/precision_limit_formatter.dart';

class GameManual extends StatefulWidget {
  final Function? onBETClick;
  final Function(Map)? onColorClick;
  final bool? disabled;
  GameManual({Key? key, this.onBETClick, this.onColorClick, this.disabled})
      : super(key: key);

  @override
  State<GameManual> createState() => _GameManualState();
}

class _GameManualState extends State<GameManual> {
  int _selectNum = 1;
  late TextEditingController _textEditingController;
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _textEditingController = TextEditingController(text: '');
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
            height: 50,
            alignment: Alignment.center,
            margin: EdgeInsets.only(left: 4),
            decoration: BoxDecoration(
                border: _loutLine(),
                color: Color(0xFF221B50),
                borderRadius: BorderRadius.all(Radius.circular(5.0))),
            child: Row(
              children: [
                Padding(
                  padding: EdgeInsets.only(left: 10),
                  child: Text(
                    'R\$ ',
                    style: TextStyle(color: Utils().whiteColor(), fontSize: 20),
                  ),
                ),
                Expanded(
                    child: TextField(
                  cursorColor: Colors.white,
                  controller: _textEditingController,
                  keyboardType: TextInputType.number,
                  inputFormatters: [
                    // FilteringTextInputFormatter.allow(RegExp("[0-9.]"))
                    PrecisionLimitFormatter(2)
                  ],
                  style: TextStyle(color: Colors.white),
                  decoration: InputDecoration(
                    border: InputBorder.none,
                  ),
                ))
              ],
            )),
        Padding(
          padding: EdgeInsets.only(top: 20),
          child: Row(
            children: [
              Expanded(
                child: _borderButton(
                    text: '+1',
                    onTap: () {
                      _textEditingController.text =
                          '${int.parse(_getInputStr()) + 1}';
                    }),
                flex: 1,
              ),
              Expanded(
                child: _borderButton(
                    text: '+10',
                    onTap: () {
                      try {
                        _textEditingController.text =
                            '${int.parse(_getInputStr()) + 10}';
                      } catch (e) {}
                    }),
                flex: 1,
              ),
              Expanded(
                child: _borderButton(
                    text: '+100',
                    onTap: () {
                      try {
                        _textEditingController.text =
                            '${int.parse(_getInputStr()) + 100}';
                      } catch (e) {}
                    }),
                flex: 1,
              ),
              Expanded(
                child: _borderButton(
                    text: '1/2',
                    onTap: () {
                      try {
                        _textEditingController.text =
                            '${int.parse(_getInputStr()) ~/ 2}';
                      } catch (e) {}
                    }),
                flex: 1,
              ),
              Expanded(
                child: _borderButton(
                    text: '×2',
                    onTap: () {
                      try {
                        _textEditingController.text =
                            '${int.parse(_getInputStr()) * 2}';
                      } catch (e) {}
                    }),
                flex: 1,
              ),
            ],
          ),
        ),
        Padding(
          padding: EdgeInsets.only(top: 20),
          child: Row(
            children: [
              Expanded(
                child: _colorButton(
                    text: '×2',
                    color: Color(0xFFFF506F),
                    showBorder: _selectNum == 1,
                    onClick: () {
                      if (widget.onColorClick != null) {
                        widget.onColorClick!({
                          'label': 'x2',
                          'color': 'RED',
                        });
                      }
                      setState(() {
                        _selectNum = 1;
                      });
                    }),
                flex: 1,
              ),
              Expanded(
                child: _colorButton(
                    showBorder: _selectNum == 2,
                    borderColor: Color(0xFF3D77E8),
                    onClick: () {
                      if (widget.onColorClick != null) {
                        widget.onColorClick!({
                          'label': 'x14',
                          'color': 'WHITE',
                        });
                      }
                      setState(() {
                        _selectNum = 2;
                      });
                    },
                    text: '×14',
                    color: Colors.white,
                    textColor: Colors.black),
                flex: 1,
              ),
              Expanded(
                child: _colorButton(
                    showBorder: _selectNum == 3,
                    text: '×2',
                    color: Color(0xFF3D77E8),
                    onClick: () {
                      if (widget.onColorClick != null) {
                        widget.onColorClick!({
                          'label': 'x2',
                          'color': 'BLUE',
                        });
                      }
                      setState(() {
                        _selectNum = 3;
                      });
                    }),
                flex: 1,
              ),
            ],
          ),
        ),
        Container(
          width: Utils().getScreenWidth(context),
          margin: EdgeInsets.only(top: 20),
          height: 50,
          child: ElevatedButton(
              onPressed: widget.disabled == true
                  ? null
                  : () {
                      String? userId = context.read<UserModel>().userId;
                      if (userId == '') {
                        Navigator.pushNamed(context, 'LoginPage');
                        return;
                      }
                      // print(1111);
                      if (widget.disabled == true) {
                        return;
                      }
                      if (widget.onBETClick != null) {
                        // print(22222);
                        widget.onBETClick!(
                            {'inputMoney': _textEditingController.text});
                      }
                    },
              style: ButtonStyle(
                backgroundColor: MaterialStateProperty.all(
                    widget.disabled == true
                        ? Color(0xFF5134A2)
                        : Color(0xFF7A50F0)),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    'BET${_textEditingController.text != '' ? '+' + _textEditingController.text : ''}',
                    style: TextStyle(color: Colors.white),
                  ),
                  // Visibility(
                  //     visible: true,
                  //     child: Text(
                  //       '这里填写倍数',
                  //       style: TextStyle(
                  //           color: Utils().whiteColor(), fontSize: 12),
                  //     ))
                ],
              )),
        ),
      ],
    );
  }

  // 边框的container
  Border _loutLine() {
    return Border.all(width: 1, color: Color.fromRGBO(255, 255, 255, 0.5));
  }

  Widget _borderButton({String? text, Function? onTap}) {
    return GestureDetector(
      onTap: () {
        if (onTap != null) {
          onTap();
        }
      },
      child: Container(
          height: 50,
          alignment: Alignment.center,
          margin: EdgeInsets.only(left: 4),
          child: Text(
            text ?? '',
            style: TextStyle(color: Utils().whiteColor(), fontSize: 20),
          ),
          decoration: BoxDecoration(
              border: _loutLine(),
              color: Color(0xFF221B50),
              borderRadius: BorderRadius.all(Radius.circular(5.0)))),
    );
  }

  BoxBorder _buttonBorder({Color? borderColor}) {
    return Border.all(width: 4, color: borderColor ?? Colors.white);
  }

  String _getInputStr() {
    String str = '';
    if (_textEditingController.text == '') {
      str = '0';
    } else {
      str = _textEditingController.text;
    }
    return str;
  }

  Widget _colorButton(
      {String? text,
      Color? color,
      Color? textColor,
      bool? showBorder,
      Color? borderColor,
      Function? onClick}) {
    return GestureDetector(
      onTap: () {
        if (onClick != null) {
          onClick();
        }
      },
      child: Container(
          height: 50,
          alignment: Alignment.center,
          margin: EdgeInsets.only(left: 4),
          child: Text(
            text ?? '',
            style: TextStyle(
                color: textColor ?? Utils().whiteColor(), fontSize: 20),
          ),
          decoration: BoxDecoration(
              border: showBorder == true
                  ? _buttonBorder(borderColor: borderColor)
                  : null,
              color: color ?? Color(0xFF221B50),
              borderRadius: BorderRadius.all(Radius.circular(5.0)))),
    );
  }
}
